<template>
  <div>
    <!--磅单模板编辑dialog-->
    <el-dialog
      :title="title"
      width="570px"
      v-dialogDrag
      :visible.sync="editVisible"
      :close-on-click-modal="false"
    >
      <el-form
        label-width="105px"
        :rules="dataRule"
        ref="editForm"
        :model="editForm"
      >
        <el-form-item label="模板类型:" prop="templateType">
          <el-select clearable v-model="editForm.templateType">
            <el-option
              v-for="item in  $dictUtils.getDictList('templateType')"
              :key="item.value"
              :label="item.label"
              :value="Number(item.value)">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="业务流程类型:" prop="processType">
          <el-select clearable v-model="editForm.processType">
            <el-option
              v-for="item in  $dictUtils.getDictList('processType')"
              :key="item.value"
              :label="item.label"
              :value="Number(item.value)">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模板编号:" prop="templateCode">
          <el-input v-model="editForm.templateCode" maxlength="10" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="模板名称:" prop="templateName">
          <el-input v-model="editForm.templateName" maxlength="10" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="模板描述:" prop="describes">
          <el-input v-model="editForm.describes" maxlength="50" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="模板状态:" prop="state">
          <el-select clearable v-model="editForm.state">
            <el-option
              v-for="item in  $dictUtils.getDictList('templateState')"
              :key="item.value"
              :label="item.label"
              :value="Number(item.value)">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" type="primary" @click="doSubmit()" v-noMoreClick
          >确定</el-button
        >
        <el-button size="small" @click="close()">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { edit,  queryById } from '@/api/basis/weightTemple/weightTemple.js'
export default {
  components: {},
  data () {
    return {
      method: '',
      title: '',
      editForm: {
        truckId: '',
        ruleType: 0,
        sourceId: '',
        score: '',
        state: 0,
        remark: '',
        id: ''
      },
      page: {
        pageSize: 10,
        pageNo: 1,
        total: 0
      },
      dictOptions: [],
      editVisible: false,
      detailsVisible: false,
      dataRule: {
        templateType: [
          { required: true, message: '请选择模板类型', trigger: 'change' }
        ],
        processType: [
          { required: true, message: '请选择业务流程类型', trigger: 'change' }
        ],
        templateCode: [
          { required: true, message: '模板编号不能为空', trigger: 'blur' }
        ],
        templateName: [
          { required: true, message: '模板名称不能为空', trigger: 'blur' }
        ],
        state: [
          { required: true, message: '请选择模板状态', trigger: 'change' }
        ]
      }
    }
  },
  methods: {
  	handleClose(done) {
			this.$Msg.confirm({
				title:'您确定要关闭吗？',
				content:this.GLOBAL.FORM_CLOSE_TIPS,
				confirmCall:()=>{
					done();
				}
			})
		},
    init (method, editForm) {
      if (method === 'add') {
        this.editVisible = true
        this.$nextTick(() => {
          this.$refs['editForm'].resetFields()
          this.editForm = {}
        })
        this.editForm.id = ''
        this.title = '新增模板'
      } else if (method === 'edit') {
        this.editVisible = true
        this.method = method
        this.$nextTick(() => {
          this.$refs.editForm.clearValidate()
            queryById({
                id: editForm
            }).then(({data}) => {
                if (data.code === '200') {
                    this.editForm = data.result
                }
            })
        })

        this.title = '修改模板'
      }
    },
    close () {
      this.editForm = {}
      this.editVisible = false
    },
    doSubmit () {
      this.$refs['editForm'].validate((valid) => {
        if (valid) {
          this.$set(this.editForm, 'props', 1)
          edit(this.editForm).then(({data}) => {
            if (data.code === '200') {
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.editVisible = false
              this.$emit('refreshDataList')
            }
          })
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.view-container {
  margin-bottom: 20px;
  display: flex;
  .label-container {
    width: 150px;
    text-align: right;
    font-size: 16px;
    font-weight: 400;
    color: #666666;
  }
  .form-container {
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    width: 200px;
  }
}
</style>
